<template>
  <div class="MessageArea-container">
    <FormData v-on="$listeners"/>
    <FormList :list="list" :title="title"  :total="total" />
    <div class="comment-end" v-show="isListLoading" v-loading="isListLoading"></div>
  </div>
</template>

<script>
import FormData from "./FormData";
import FormList from "./FormList";
export default {
  props: {
    title: {
      type: String,
      default: "",
    },
    total: {
      type: Number,
      default: 0,
    },
    list: {
      type: Array,
      default: () => {
        [];
      },
    },
    isListLoading: {
      type: Boolean,
      default: false,
    },
  },
  components: {
    FormData,
    FormList
  },
};
</script>

<style lang='less' scoped>
.MessageArea-container {
  padding: 5px;
}
.comment-end{
  height: 80px;
}

</style>